<template>
	<view class="container">
		<scroll-view class="scroll-view_H" scroll-y="true">
			<view class="top-card">
				<view class="status-card flex flex-column align-center">
					<img style="width: 70rpx;height: 70rpx;" src="@/static/images/success-ico.png" alt="">
					<text class="f-s-34 f-bold m-t-10 m-b-10" style="color: #22B35E;">出院结算成功</text>
					<text class="f-s-24 color-999">退款金额预计x个工作日内退回原付款账户</text>
				</view>
			</view>
			<view style="width: 100%;height: 60px;"></view>
			<view class="content-card flex flex-column">
				<view class="flex align-center justify-between">
					<text class="f-s-28">退款金额</text>
					<text class="f-s-34" style="color: #FF6430;">￥23456</text>
				</view>
				<view class="m-t-15 m-b-15" style="border-bottom: 1px dashed #A6A6A6;"></view>
				<view class="flex align-center justify-between">
					<text class="f-s-28">押金余额退款</text>
					<text class="f-s-28">￥23456</text>
				</view>
			</view>

			<view class="content-card flex flex-column">
				<view class="flex align-center">
					<text class="f-s-28">住院费用明细</text>
				</view>
				<view class="m-t-15 m-b-15" style="border-bottom: 1px solid #eeeeee;"></view>
				<view class="flex align-center justify-between">
					<text class="f-s-28">费用总金额</text>
					<text class="f-s-28">￥23456</text>
				</view>
			</view>
			<view class="content-card flex flex-column">
				<view class="flex align-center">
					<text class="f-s-28">押金明细</text>
				</view>
				<view class="m-t-15 m-b-15" style="border-bottom: 1px solid #eeeeee;"></view>
				<view class="flex align-center justify-between m-b-15">
					<text class="f-s-28">已缴押金总金额</text>
					<text class="f-s-28">￥23456</text>
				</view>
				<view class="flex align-center justify-between m-b-15">
					<text class="f-s-28">费用抵扣</text>
					<text class="f-s-28">￥23456</text>
				</view>
				<view class="flex align-center justify-between m-b-15">
					<text class="f-s-28">押金余额</text>
					<text class="f-s-28" style="color: #FF6430;">￥23456</text>
				</view>
			</view>
			<view class="content-card flex flex-column">
				<view class="flex align-center">
					<text class="f-s-28">出院信息</text>
				</view>
				<view class="m-t-15 m-b-15" style="border-bottom: 1px solid #eeeeee;"></view>
				<view class="flex align-center justify-between m-b-15">
					<text class="f-s-28 color-999">医院</text>
					<text class="f-s-28">￥23456</text>
				</view>
				<view class="flex align-center justify-between m-b-20">
					<text class="f-s-28 color-999">科室</text>
					<text class="f-s-28">￥23456</text>
				</view>
				<view class="flex align-center justify-between m-b-20">
					<text class="f-s-28 color-999">住院人</text>
					<text class="f-s-28">￥23456</text>
				</view>
				<view class="flex align-center justify-between m-b-20">
					<text class="f-s-28 color-999">病区</text>
					<text class="f-s-28">￥23456</text>
				</view>
				<view class="flex align-center justify-between m-b-20">
					<text class="f-s-28 color-999">床位</text>
					<text class="f-s-28">￥23456</text>
				</view>
				<view class="flex align-center justify-between m-b-20">
					<text class="f-s-28 color-999">医生</text>
					<text class="f-s-28">￥23456</text>
				</view>
				<view class="flex align-center justify-between m-b-20">
					<text class="f-s-28 color-999">住院号</text>
					<text class="f-s-28">￥23456</text>
				</view>
				<view class="flex align-center justify-between m-b-20">
					<text class="f-s-28 color-999">住院时间</text>
					<text class="f-s-28">￥23456</text>
				</view>
			</view>

			<view class="content-card flex flex-column">
				<view class="flex align-center">
					<text class="f-s-28">出院须知</text>
				</view>
				<view class="m-t-15 m-b-15" style="border-bottom: 1px solid #eeeeee;"></view>
				<view class="flex align-center m-b-15">
					<text class="f-s-28">1.保持心情愉快，情绪稳定，避免精神紧张和过度疲劳。2.饮食以清淡为宜，多进食低脂、低盐、低胆固醇、富含维生素 的食物，多进食蔬菜和水果，不宜饮浓茶、暴饮暴食，避免过分饥饿， 戒烟限酒。3.生活起居有规律，保证睡眠充足，养成良好的生活习惯。坚持 适度运动和锻炼。尽量不要单独外出，必须外出时，需戴口罩，并且
						随身携带病情卡片（写明疾病、姓名、地址、联系电话号码）以利疾 病发作时取得联系，便于抢救。4.按医嘱正确服药，定期门诊复查，必须带上患者的门诊病历及 出院记录，门诊医生将会根据您的情况及相关检查情况来调整药物。 如有病情变化，应随时到医院就诊。</text>
				</view>
			</view>

		</scroll-view>

		<view class="to-register" @click="backIndex">
			<u-button type="primary" text="返回首页"></u-button>
		</view>
	</view>
</template>

<script>
	import {
		getDictType
	} from "@/api/system/public.js";
	export default {
		components: {

		},
		data() {
			return {
				detailList: [1, 2, 3, 4, 5, 6, 7, 8, 9]
			}
		},
		onLoad(options) {

		},
		methods: {
			/* 返回首页 */
			backIndex() {
				uni.reLaunch({
					url:'/pages/index'
				})
				
			}

		}
	}
</script>

<style lang="scss">
	page {
		background-color: rgb(245, 245, 245);
		height: 100%;

		.container {
			width: 100%;
			height: 100%;

			.scroll-view_H {
				width: 100%;
				height: calc(100vh - 120rpx);

				.content-card {
					width: 94%;
					margin-left: 3%;
					margin-top: 20rpx;
					border-radius: 12rpx;
					padding: 30rpx;
					background-color: #fff;
				}

				.top-card {
					width: 100%;
					height: 120px;
					// background: linear-gradient(180deg, rgba(77, 142, 255, 1) 0%, rgba(197, 218, 255, 1) 100%);
					background:  linear-gradient(180deg, rgba(77, 142, 255, 1) 0%, rgba(22, 119, 255, 0) 100%);
					position: relative;

					.status-card {
						width: 94%;
						height: 120px;
						margin-left: 3%;
						border-radius: 12rpx;
						padding: 30rpx;
						background-color: #fff;
						position: absolute;
						left: 0;
						bottom: -60px;

					}

				}



			}

		}

	}

	.to-register {
		width: 100%;
		padding: 0 20rpx;
		position: fixed;
		bottom: 10px;
	}
</style>
